<div class="layui-fluid">
	<div class="layui-row">

		<div class=" " id="tvideobox">
		</div>

		<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
			<!-- 	<ul class="layui-tab-title" style="	margin-top: 10px;">
					<li class="layui-this">报名列表 （<font id="count1">0</font>条）</li>
				</ul> -->
			<div class="layui-tab-content" style="padding: 10px 0;">
				<div class="layui-tab-item layui-show">
					<!-- 评论 -->
					<div class="tabtitle">
						报名列表
					</div>
					<table id="teachertable1" lay-filter="type_hash" lay-even lay-skin="nob"></table>
					<div class="open-adduser">
						<div class="open-addbox">
							<div class="open-oneadd">
							</div>
							<div class="open-oneadd">

							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

	</div>
</div>



<script type="text/html" id="videodet">
	<div class="layui-row playtab">
			
	<div class="layui-col-xs12 layui-col-sm4 layui-col-md5 layui-col-lg2">
		<div class = "videoO-fm" style="background-image: url({{  IMG_URL + d.tbCover }});">
		</div> 
	</div>
	<div class="layui-col-xs12 layui-col-sm8 layui-col-md7 layui-col-lg10">
	<div class = "videoO-tcont" >
	<div class = "videoO-title" >
	{{d.tbTitle}}
		</div> 
		<div class="videoO-time">
				讲课地址：{{d.tbAdress}}
		</div>
		<div class = "videoO-time" >
		讲课时间：{{d.tbTime}}
		</div>	
			<div class = "videoO-time" >
				<span>	浏览：{{d.browseNumber}}人 </span>
				<span style="margin-left:20px;">	分享量：{{d.shareNumber}}人 </span>
		</div>	
		
		</div >
		</div>
			</div>
	</div>
	
				<div class="playtab" style="padding: 0;">
				<div class="textli">
					<b>课程类型</b>
					{{#  layui.each(d.typeNames, function(index1, item1){ }}
						<span class="slashright" >{{item1.courseTypeName}}</span>
					{{# }) }}
				
				</div>
				<div class="textli bottomhr">
				
					<b>上架状态</b> <span class="layui-form" ><input lay-filter="videostatusdemo" type="checkbox" name="" lay-skin="switch" lay-text="上架|下架"  {{ d.tbStatus == 1 ? 'checked' : '' }}></span>
					<!-- {{ d.tbStatus == 1 ? 'checked' : '' }} -->
					    <span>
					</span>
				</div>
				<div class="textli">
					<b>操作</b>
					<span> <font class="cupo" id="bjbtn" lay-event="edit">
						编辑
					</font>  / <font class="cupo" id="delbtn" lay-event="del">删除				</font> </span>
				</div>
			<!-- 课程简介 -->
			<!-- 右侧  -->
		</div>

</script>


<!----------------------------------------------- 报名列表 ----------------------------------------------->
<script type="text/html" id="barteachertable">

	<a class="layui-btn" lay-event="del">删除</a>
</script>

<script type="text/html" id="teachertoolbar">
	<div class="toobarbox "  >

		<div class="">
				<div class="layui-inline">
			<input type="text" class="layui-input" id="datpl" placeholder="选择日期">
		</div>
			<div class="tablesearch iconfont iconsousuo ">
					<input type="text" class="layui-input " id="tablesearchid" title="请输入搜索的关键字" placeholder="请输入搜索关键字">
			</div>
		</div>
		</div>
</script>

<script type="text/html" id="headimgTp">
	<!-- 这里的 checked 的状态只是演示 -->
 <img src="{{ IMG_URL + d.photo }}"  style="height: 100%;"  alt="讲师头像"  >
</script>

<script type="text/html" id="StatusTp1">
	<!-- 这里的 checked 的状态只是演示 -->
  <input type="checkbox" name="isTop" value="{{d.isTop}}" lay-skin="switch"  lay-filter="istopDemo" {{ d.isTop == 1 ? 'checked' : '' }}>
</script>

<script>
	layui.config({
		base: '/src/js/'
	}).use(['jquery', 'mockjs', 'table', 'sidebar', 'form', 'laydate', 'laytpl'], function() {
		var $ = layui.jquery,
			layer = layui.layer,
			table = layui.table,
			sidebar = layui.sidebar,
			form = layui.form,
			laytpl = layui.laytpl,
			laydate = layui.laydate;

		var router = layui.router();
		// 获取当前的视频详情
		form.render()
		POSTAJAX(XXById2, {
			tbId: router.search.tbId
		}, function(res) {
			laytpl($("#videodet").html()).render(res.data, function(html) {
				$("#tvideobox").html(html);
				form.render();
				$('#bjbtn').on("click", function() {
					console.log("点击了当前")
					window.location.href = "#/xxcourse/det?tbId=" + router.search.tbId;
				})
				$('#delbtn').on("click", function() {
					console.log("21")
					POSTAJAX(XXDel, {
						tbId: router.search.tbId
					}, function(res) {
						layer.msg(res.msg)
						location.href = "#/xxcourse/list?type=" + router.search.type;
					})

				})

			});
		})
		//报名列表
		var plitemjson = {
			search: '',
			startTime: '',
			stopTime: '',
			tbId: router.search.tbId,
			type: 3
		}


		//基础
		var tablejson = [ //表头
			{
				type: 'numbers',
				fixed: 'left',
				title: '序号',
				width: 50
			},
			{
				field: 'tbId',
				title: 'ID',
				hide: true
			}, {
				field: 'photo',
				title: '用户头像',
				templet: '#headimgTp',
				event: 'lookheadimg',
				width: 150
			}, {
				field: 'realName',
				title: '真实姓名'
			}, {
				field: 'tbPhone',
				title: '手机号码',
				width: 120,

			}, {
				field: 'createTime',
				title: '报名时间',
				width: 200
			}, {
				title: '操作',
				fixed: 'right',
				width: 200,
				toolbar: '#barteachertable'
			}
		]

		var plkey = '';
		var typetable = table.render({
			size: 'lg',
			id: 'pltableid',
			where: plitemjson,
			contentType: 'application/json',
			pageSize: 10,
			elem: '#teachertable1',
			toolbar: '#teachertoolbar',
			url: HH_URL + XXBmList, //数据接口
			page: true, //开启分页
			even: true,
			skin: 'nob',
			cellMinWidth: 100,
			cols: [
				tablejson
			],
			done: function(res, curr, cont) {

				$('#count1').html(cont)
				$('#tablesearchid').keydown(function(event) {
					if (event.keyCode == 13) {
						xykey = $('#tablesearchid').val();
						plitemjson.search = $('#tablesearchid').val()
						table.reload('pltableid', {
							where: plitemjson,
							page: {
								curr: 1 //重新从第 1 页开始
							}
						}, 'data');
						// setTimeout(function(){
						$("#tablesearchid").val(xykey)
						// },100)
					}

				})
				if (plitemjson.startTime != '') {
					//时间搜索框的处理
					$("#datpl").val(plitemjson.startTime + ' - ' + plitemjson.stopTime)
				}

				//时间搜索选择
				laydate.render({
					elem: '#datpl', //指定元素
					range: true,
					done: function(value, date, endDate) {
						if (value == '') {
							plitemjson.startTime = '',
								plitemjson.stopTime = ''

						} else {
							plitemjson.startTime = date.year + '-' + date.month + '-' + date.date,
								plitemjson.stopTime = endDate.year + '-' + endDate.month + '-' + endDate.date
						}
						table.reload('pltableid', {
							where: plitemjson,
							page: {
								curr: 1 //重新从第 1 页开始
							}
						});
					}
				});

			}
		});


		//监听事件
		table.on('toolbar(type_hash)', function(obj) {
			var checkStatus = table.checkStatus(obj.config.id);
			var data = obj.data; //获得当前行数据
			var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
			var tr = obj.tr; //获得当前行 tr 的DOM对象
			switch (layEvent) {

				case 'addbtn':

					break;
				default:

					break;
			}
		});


		//监听工具条
		table.on('tool(type_hash)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
			var data = obj.data; //获得当前行数据
			var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
			var tr = obj.tr; //获得当前行 tr 的DOM对象
			switch (layEvent) {
				case 'look':
					layer.msg(JSON.stringify(obj.data));
					break;
				case 'del':
					delfn({
						tbId: obj.data.tbId
					}, obj);

					break;
				case 'lookheadimg':
					layer.open({
						type: 1,
						title: false,
						closeBtn: 0,
						area: '80%,auto ',
						skin: 'layui-layer-nobg', //没有背景色
						shadeClose: true,
						content: ' <img src="' + IMG_URL + obj.data.photo + '"  alt="讲师头像"  >'
					});
					// layer.msg("图图图")
					break;
				default:
					break;
			}
		});

		form.on('switch(videostatusdemo)', function(obj) {
			// 监听协议的状态替换
			if (obj.elem.checked) {
				var checknum = 1
			} else {
				var checknum = 2
			}
			POSTAJAX(XXModStatus, {
				type: checknum,
				tbId: router.search.tbId
			}, function(res) {
				layer.msg(res.msg);

			})
		});

		function delfn(tdata, obj) {
			layer.confirm('确认删除该用户的报名吗?', function(index) {
				POSTAJAX(XXBmDel, tdata, function(res) {
					layer.close(index);
					layer.msg(res.msg);
					if (res.status == 200) {
						obj.del(); //删除对应行（tr）的DOM结构，并更新缓存

					}

				})
			});
		}


	});
</script>

<style scoped>

</style>
